<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title>开通会员</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="css/common.css"/>
		<link rel="stylesheet" type="text/css" href="css/index.css"/>
	</head>
	<body class="bg_ff">
		<header class="mui-bar mui-bar-nav">
		    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		    <h1 class="mui-title">开通会员</h1>
		</header>
		<div class="mui-content bg_ff">
		    <div class="vip_top">
				<span class="h4">￥</span>
				<span>10</span>
			</div>
			<p class="text-center"><a href="javascript:void(0);" class="btn_kt"></a></p>
			<div class="mg_top20 padding_12">
				<p class="color_00 font_15"><img width="15 " class="vertical-align_m mg_r5" src="images/sj.png"/> 会员权益</p>
				<p class="mg_top30 color_4 content_me"></p>
			</div>
		</div>
		<div class="vip_mask">
			<img width="80" class="head" src="images/head.png"/>
			<h5 class="color_00 mg_tb20 font_16 my_name"></h5>
			<h4 class="color_00 h4 mg_b10">1个月</h4>
			<h3 class="color_00 h3 mg_b10">￥10.0/月</h3>
			<p class="vip_pay">
				<a href="javascript:void(0);" data-type='2'><img src="images/icon_pay.png"/>支付宝</a>
				<a href="javascript:void(0);" data-type='1'><img src="images/pay_wx.png"/>微信</a>
				
			</p>
		</div>
		<div class="overlay">
			
		</div>
		
	
		
		
		<script src="js/mui.js"></script>
		<script src="js/jquery-1.7.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/index.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			mui.init()
			//获取我的信息
			function getUserInfoById(){
				$('.gif').show()
				$.ajax({
					type:"post",
					url:urlcom + "user/getUserInfoById",
					async:true,
					dataType:'json',
					data:{
						userId:localStorage.getItem('userId')
					},
					success:function(res){
						$('.gif').hide()
						if(res.code==0){
							$('.my_name').html(res.data.name)//用户名
							$('.head').attr('src',res.data.headImg)//头像
							
							
							
							//判断是否是vip
							if(res.data.isvip == 1){
								$('.btn_kt').html()
							}else{
								$('.btn_kt').html()
							}
						}else{
							msg(res.msg)
						}
		 			}
			     })
			}
			getUserInfoById()
			var wxChannel = null; // 微信支付 
			var aliChannel = null; // 支付宝支付
			mui.plusReady(function() {
				
				//获取支付通道
				plus.payment.getChannels(function(channels) {
					channels.forEach(function(k,v){
						if(k.id=='wxpay'){
							wxChannel = k
						}else if(k.id=='alipay'){
							
							aliChannel = k
						}
					})
				}, function(e) {
					alert("获取支付通道失败：" + e.message);
				})		
				
			});
			//会员充值
			function viprecharge(type){
				$.ajax({
					type:"post",
					url:urlcom + "pay/getVipPayInfo",
					async:true,
					dataType:'json',
					data:{
						userId:localStorage.getItem('userId'),
						payType:type
					},
					success:function(res){
						if(res.code==0){
							//调用支付接口
							if(type == 2) {
								plus.payment.request(aliChannel, res.data.orderInfo, function(result) {
									plus.nativeUI.alert('支付成功!', function() {
										mui.back();
									}, '开通会员');
								}, function(e) {
									plus.nativeUI.alert('支付宝支付失败');
								});
							} else if(type == 1) {
								plus.payment.request(wxChannel, {
									"appid":res.data.appid,
									"partnerid":res.data.partnerId,
									"package":res.data.package,
									"prepayid":res.data.prepayId,
									"noncestr":res.data.nonceStr,
									"timestamp":res.data.timeStamp,
									"sign":res.data.sign,
								}, function(result) {
									plus.nativeUI.alert('支付成功!', function() {
										mui.back();
									}, '开通会员');
								}, function(e) {
									plus.nativeUI.alert(JSON.stringify(e));
								});
							}
							
							
						}else{
							msg(res.msg)
						}
		 			}
			     })
			}
			function getAgreement(){
				$.ajax({
					type:'get',
					url:urlcom+'public/getAgreement',
					async:true,
					dataType:'json',
					data:{type:getUrlParam('type')},
					success:function(res){
						if(res.code==0){
							$('.content_me').html(res.data.content)
							
						}
					
					}
					
			    })
			}getAgreement()
			
			$(function(){
				$('.vip_pay a').click(function(){
					$(this).addClass('active').siblings().removeClass('active')
					var type = $(this).attr('data-type')
					viprecharge(type)
				})
				$('.btn_kt').click(function(){
					$('.overlay').show()
					$(".vip_mask").fadeIn(200)
				})
				$('.overlay').click(function(){
					$(this).hide()
					$(".vip_mask").fadeOut(200)
				})
			})
		</script>
	</body>

</html>
